.avatar {
  position: relative;

  img {
    width: 100%;
    position: absolute;
    bottom: 0;

  }

  img:nth-child(1) {
    border-radius: 50%;
    width: 48px;
    height: 48px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -24px 0 0 -24px;
    overflow: hidden;
  }

  // 84 / 2 = 42

  // 168 / 2 = 89

  img:nth-child(2) {
    width: 84px;
    height: 84px;
    position: relative;
    z-index: 1;
  }



}
